<template>
  <view>
    <l-form-cell v-model="form.address" label="居住地址" placeholder="请输入居住地址" :disabled="disabled" />
    <l-form-cell v-model="form.emergentName" label="紧急联系人" placeholder="请输入紧急联系人" :disabled="disabled" />
    <l-form-cell v-model="form.emergentPhone" label="紧急联系电话" placeholder="请输入紧急联系电话" :type="disabled ? 'text' : 'number'" :maxlength="11" :disabled="disabled" />
    <l-form-cell label="入职时间" has-slot :arrow="!disabled" unlined @click="changeDate('entryDate')">
      <view class="form-item flex-row form-item justify-end align-center">
        <text class="text-30" :class="['color-t' + (form.entryDate ? 1 : 3)]">{{ form.entryDate || '请选择入职时间' }}</text>
      </view>
    </l-form-cell>
  </view>
</template>

<script>
export default {
  name: 'ContactInformationModel',
  props: {
    data: {
      type: Object,
      default: () => {}
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      form: {
        address: '',
        emergentName: '',
        emergentPhone: '',
        entryDate: ''
      }
    }
  },
  watch: {
    data: {
      handler(e) {
        Object.keys(this.form).forEach(item => {
          this.form[item] = e[item]
        })
      },
      deep: true
    },
    form: {
      handler() {
        this.$emit('update', this.form)
      },
      deep: true
    }
  },
  methods: {
    // 修改日期
    changeDate(attr) {
      this.$emit('changeDate', attr)
    }
  }
}
</script>

<style scoped>

</style>
